<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        let arr = [10, 20, 30, [90, [50, 1]], 30, [10, 99]]
        function nor(arr) {
            var flag = false;
            var newArr = arr.reduce((preVal, curVal) => {
                if (Array.isArray(curVal)) {
                    flag = true;
                    return [...preVal, ...curVal]
                } else {
                    return [...preVal, curVal]
                }
            }, [])
            if (flag) {
                newArr = nor(newArr)
            }
            return newArr
        }
        console.log(nor(arr))

        /* function flatter1(arr) {
            if (!arr.length) return;
            return arr.reduce(
                (pre, cur) =>
                    Array.isArray(cur) ? [...pre, ...flatter1(cur)]
                        : [...pre, cur], []

            )
        } */

        function flatter2(arr) {
            return arr.reduce((pre, cur) => {
                return pre.concat(Array.isArray(cur) ? flatter2(cur) : cur)
            }, [])
        }

        /*  function flatter1(arr) {
             return arr.reduce((pre, cur) => Array.isArray(cur) ? [...pre, ...flatter1(cur)] : [...pre, cur], [])
         } */
        function flatter1(arr) {
            return arr.reduce((pre, cur) =>
                Array.isArray(cur) ? [...pre, ...flatter1(cur)] : [...pre, cur]
                , [])
        }

        console.log(flatter1(arr))
        console.log(flatter2(arr))

    </script>
</body>

</html>